import './css/index.css';
let box = document.querySelector('.box');
let p = document.querySelector('p');
let btn = document.querySelector('button');
let arr = ['吴松镇', '严伟鹏', '黄星海', '陈伟庭'];
let div = document.createElement('div');
let nameResult = '';
let indexNum = 0;
let timer;

btn.addEventListener('click', () => {
  if (btn.innerText == '停止匹配') {
    btn.innerText = '继续匹配';
    if (arr.length > 0) {
      indexNum = arr.indexOf(nameResult);
      arr.splice(indexNum, 1);
    }
    let span = document.createElement('span');
    box.insertBefore(div, btn);
    span.innerText = `${nameResult} `;
    div.append(span);
    btn.classList.remove('active-btn');
    clearInterval(timer);
  } else {
    if (arr.length == 0) {
      btn.classList.remove('active-btn');
      btn.classList.add('disable');
      btn.innerText = '无法继续匹配';
      btn.disabled = true;
      return;
    }
    btn.innerText = '停止匹配';
    btn.classList.add('active-btn');
    timer = setInterval(() => {
      let num = Math.floor(Math.random() * arr.length);
      nameResult = arr[num];
      p.innerText = nameResult;
    }, 100);
  }
});

// 将作业打印在页面上
let element = document.body.cloneNode(true).outerHTML;
const textElement = document.createElement('pre');
textElement.innerText = element;
document.body.appendChild(textElement);
